<template>
  <el-radio-group v-model="modelValue">
    <el-radio :value="item[props.valueKey]" v-for="item in list" :key="item[props.valueKey]">{{
      item[props.labelKey]
    }}</el-radio>
  </el-radio-group>
</template>

<script setup>
import { getCommonData } from "@/api/project/common.js";
const modelValue = defineModel();
const dataList = ref([]);
const props = defineProps({
  dataList: {
    type: Array,
    default: () => [],
  },
  valueKey: {
    type: String,
    default: "id",
  },
  labelKey: {
    type: String,
    default: "name",
  },
  isFetch: {
    type: Boolean,
    default: true,
  },
  paramsName: String,
});
const list = computed(() => {
  return props.isFetch ? dataList.value : props.dataList;
});
//获取数据
const getDataList = async () => {
  const params = {
    bizName: props.paramsName,
  };
  try {
    const res = await getCommonData(params);
    dataList.value = res.data;
  } catch (error) {
    console.log(error);
  }
};
onMounted(() => {
  props.isFetch && getDataList();
});
watch(
  list,
  (newValue) => {
    //默认选中第一个单选框
    if (newValue.length) {
      modelValue.value = newValue[0][props.valueKey];
    }
  },
  {
    immediate: true,
  }
);
</script>

<style scoped lang="scss"></style>
